<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
// import ToastMsg from '@youngbeen/angle-vue-component/ToastMsg.vue'

export default {
  components: {
    // ToastMsg
  },
  created () {
    // eslint-disable-next-line no-undef
    // window.$pageSpy = new PageSpy()
  }
}
</script>

<style lang="less">
html, body {
  min-height: 100%;
}
#app {
  position: relative;
  // font-family: 'Avenir', Helvetica, Arial, sans-serif;
  // -webkit-font-smoothing: antialiased;
  // -moz-osx-font-smoothing: grayscale;
  // text-align: center;
  // color: #2c3e50;
}
.primary-button {
  height: 68px;
  line-height: 68px;
  padding: 0 12px;
  color: #fff;
  background: red;
  border: none;
  border-radius: 8px;
  font-size: 28px;
}
.default-button {
  height: 68px;
  line-height: 68px;
  padding: 0 12px;
  color: #fff;
  background: rgb(95, 95, 95);
  border: none;
  border-radius: 8px;
  font-size: 28px;
}
.icon-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  border-radius: 100%;
  background: rgba(red, 0.8);
  color: #fff;
  .icon {
    width: 50px;
    height: 50px;
  }
}

.char-backpacker { background: url('@/assets/characters/char_backpacker.jpg') no-repeat; background-size: cover; }
.char-boxer { background: url('@/assets/characters/char_boxer.jpg') no-repeat; background-size: cover; }
.char-fatboy { background: url('@/assets/characters/char_fatboy.jpg') no-repeat; background-size: cover; }
.char-lumberjack { background: url('@/assets/characters/char_lumberjack.jpg') no-repeat; background-size: cover; }
.char-moviefan { background: url('@/assets/characters/char_moviefan.jpg') no-repeat; background-size: cover; }
.char-oldman { background: url('@/assets/characters/char_oldman.jpg') no-repeat; background-size: cover; }
.char-soldier { background: url('@/assets/characters/char_soldier.jpg') no-repeat; background-size: cover; }
.char-sportgirl { background: url('@/assets/characters/char_sportgirl.jpg') no-repeat; background-size: cover; }

.item-board { background: url('@/assets/items/board.jpg') no-repeat; background-size: cover; }
.item-bone { background: url('@/assets/items/bone.jpg') no-repeat; background-size: cover; }
.item-boxingGloves { background: url('@/assets/items/boxingGloves.jpg') no-repeat; background-size: cover; }
.item-candle { background: url('@/assets/items/candle.jpg') no-repeat; background-size: cover; }
.item-chainsaw { background: url('@/assets/items/chainsaw.jpg') no-repeat; background-size: cover; }
.item-gasoline { background: url('@/assets/items/gasoline.jpg') no-repeat; background-size: cover; }
.item-golf { background: url('@/assets/items/golf.jpg') no-repeat; background-size: cover; }
.item-grenade { background: url('@/assets/items/grenade.jpg') no-repeat; background-size: cover; }
.item-machete { background: url('@/assets/items/machete.jpg') no-repeat; background-size: cover; }
.item-oil { background: url('@/assets/items/oil.jpg') no-repeat; background-size: cover; }
.item-soda { background: url('@/assets/items/soda.jpg') no-repeat; background-size: cover; }

.room-bathroom { background: url('@/assets/room/bathroom.jpg') no-repeat; background-size: cover; }
.room-bedroom { background: url('@/assets/room/bedroom.jpg') no-repeat; background-size: cover; }
.room-diningRoom { background: url('@/assets/room/diningRoom.jpg') no-repeat; background-size: cover; }
.room-evilTemple { background: url('@/assets/room/evilTemple.jpg') no-repeat; background-size: cover; }
.room-familyRoom { background: url('@/assets/room/familyRoom.jpg') no-repeat; background-size: cover; }
.room-foyer { background: url('@/assets/room/foyer.jpg') no-repeat; background-size: cover; }
.room-garage { background: url('@/assets/room/garage.jpg') no-repeat; background-size: cover; }
.room-garden { background: url('@/assets/room/garden.jpg') no-repeat; background-size: cover; }
.room-graveyard { background: url('@/assets/room/graveyard.jpg') no-repeat; background-size: cover; }
.room-kitchen { background: url('@/assets/room/kitchen.jpg') no-repeat; background-size: cover; }
.room-patio { background: url('@/assets/room/patio.jpg') no-repeat; background-size: cover; }
.room-sittingArea { background: url('@/assets/room/sittingArea.jpg') no-repeat; background-size: cover; }
.room-storage { background: url('@/assets/room/storage.jpg') no-repeat; background-size: cover; }
.room-yard1 { background: url('@/assets/room/yard1.jpg') no-repeat; background-size: cover; }
.room-yard2 { background: url('@/assets/room/yard2.jpg') no-repeat; background-size: cover; }
.room-yard3 { background: url('@/assets/room/yard3.jpg') no-repeat; background-size: cover; }
</style>
